<template>
	<div class="wrapper">
		<!-- <van-tabs title-active-color="#2687FF" color="#2687FF" @click="tabDitch()" v-model:active="active">
			<van-tab :title="item.channelName" v-for="(item,index) in tabList" :key="index" :name="index" />
		</van-tabs> -->
		<div class="dis" v-for="(item,index) in list " :key="index">
			<div class="main">
				<div class="dia" style="justify-content: space-between;">
					<div class="">
						{{item.channelName}}
					</div>
					<div class=" dredge dis" v-if="item.channelStatus==1" @click="costing(item)">
						配置成本
					</div>
					<div class="dredge dis" @click="broadminded(item)" v-else>
						开通
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import {
		openChannel,
		selectAgentChannelInf,
		selectOpenChannel
	} from '@/api/terminal'
	import store from '@/store'
	import {
		showToast
	} from 'vant'
	export default defineComponent({
		name: 'sateActive',
		setup() {
			const router = useRouter()
			const routers = useRoute()
			const state = reactive({
				tabList: [],
				channelCode: "",
				active: 0,
				list: []
			})
			// 开通渠道列表
			const broadminded = (e) => {
				router.push({
					path: '/templateMethod',
					query: {
						channelCode: e.channelCode,
						serviceNo: routers.query.serviceNo,
						parentNo: store.state.user.agentNo
					}
				})
				// openChannel({
				// 	channelCode:e.channelCode,
				// 	agentNo:routers.query.serviceNo,
				// 	parentNo:store.state.user.agentNo
				// }).then(res => {
				// 	showToast('开通成功')
				// 	getList()
				// })
			}
			//配置成本
			const costing = (item) => {

				router.push({
					path: '/degression',
					query: {
						serviceNo: routers.query.serviceNo,
						channelCode: item.channelCode,
						// agentNo:store.state.user.agentNo
					}
				})
			}
			// getTabList()
			//tab切换
			// const tabDitch = () => {
			// 	state.pageStart=1
			// 	// state.list=[]

			// 	state.channelCode=state.tabList[state.active].channelCode
			// 	getList()
			// }
			//查询数据
			const getList = () => {
				selectOpenChannel({
					parentNo: routers.query.parentNo,
					agentNo: routers.query.serviceNo
				}).then(res => {
					state.list = res.data
				})
			}
			getList()
			return {
				...toRefs(state),
				broadminded,
				getList,
				costing
			}
		}
	})
</script>
<style scoped lang="scss">
	.wrapper {
		background: #FFF9F9;
		width: 100%;
		height: 100%;
		min-height: 100vh;

		.main {
			width: 339px;
			padding: 12px 12px;
			background: #FFFFFF;
			border-radius: 6px;
			margin-top: 12px;

			.dredge {
				font-size: 12px;
				color: #fff;
				padding: 6px 10px;
				border-radius: 4px;
				background-color: #0257FF;
			}
		}
	}
</style>